<template>
	<view class="page">
		<!-- <web-view :src="data.kefuUrl" @loaded="handleLoaded" @loading="handleLoaded"></web-view> -->
		<iframe @load="handleLoaded" class="webview-box" :style="webviewStyle" :src="kefuUrl" importance="high"
			width="100%"></iframe>
	</view>
</template>

<script lang="ts" setup>
	import { computed, getCurrentInstance, ref } from "vue";
	import { onShow } from "@dcloudio/uni-app";
	import { t } from '@/locale/index'
	const sys = uni.getSystemInfoSync();
	const { proxy } = getCurrentInstance();
	const kefuUrl = ref("");

	// const kefuUrl = computed(() => {
	// 	const userInfo = uni.getStorageSync('account');
	// 	console.log(userInfo, "kkk");
	// 	if (!userInfo.id) {
	// 		proxy.$util.navigateTo(`/pages/account/login/login`);
	// 		return ""
	// 	}
	// 	return `https://w.xznw2.com/d/tv10602&zy=2?shid=${userInfo.id}`;
	// 	// return `https://w.xznw2.com/d/tv10602?shid=${userInfo.id}&zy=2`;
	// });

	const isIos = computed(() => {
		return sys.platform == 'ios'
	});

	const webviewStyle = computed(() => {
		let style : any = {}
		if (isIos.value) {
			style.marginTop = sys.statusBarHeight + 'px';
		}
		return style
	});

	const handleLoaded = () => {
		console.log("加载完成");
		uni.hideLoading();
	};
	const initUrl = () => {
		uni.showLoading({
			title: t('common.load_ing'),
			mask: true
		});
		const userInfo = uni.getStorageSync('account');
		if (!userInfo.id) {
			return proxy.$util.navigateTo(`/pages/account/login/login`);
		}
		kefuUrl.value = `https://w.xznw2.com/d/tv10602&zy=2?shid=${userInfo.id}`;
	};

	onShow(() => {
		initUrl();
	});
</script>

<style scoped lang="scss">
	page {
		min-height: auto;
	}

	.page {
		display: flex;
		flex-direction: column;
		overflow: hidden;
		height: calc(100vh - 50px - env(safe-area-inset-bottom) - var(--status-bar-height));

		.webview-box {
			flex: 1;
			height: 100%;
			border: 0;
		}
	}
</style>